<template>
  <h4>模板引用</h4>
  <input type="text" ref="ipt" />
  <Child ref="child" />
  <button @click="fn">btn</button>
</template>

<script setup>
import { onMounted, ref } from "vue";
import Child from "./06-child.vue";
const ipt = ref(null);
const child = ref(null);

onMounted(() => {
  ipt.value.focus();
});

const fn = () => {
  console.log(child.value.age);
  console.log(child.value.childClick);
};
</script>

<!-- <script>
import { onMounted, ref } from "vue";

export default {
  setup() {
    // ref实质上创建了一个空的地址引用（指向了一块空的内存）
    const ipt = ref(null);

    // const count = ref(5);

    onMounted(() => {
      // this.$refs.ipt.focus();
      ipt.value.focus();
    });

    return {
      ipt,
    };
  },
};
</script> -->
